﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage" %>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<script type="text/javascript">
    $.validator.setDefaults({
        debug: true
    });

    $(document).ready(function() {
        hideLoginArea();
        $("#errorContainer").css("float", "left");
        });

    $().ready(function() {
    $("#loginForm").validate({
             rules: {
                userName: { required: true, rangelength: [6, 12] },
                passWord: { required: true }                
            },
            messages: {
                 userName: { required: "Please enter your UserName.", rangelength: "UserName must be in 6-12 between characters." },
                 passWord: { required: "Please enter your Password." }
            },
//            remote: {
//                url: "Account/Login",   
//                type: "post",             
//                dataType: "json",          
//                data: {                    
//                    username: function() {
//                        return $("#userName").val();
//                        return $("#passWord").val();
//                    }
//                }
//            },
            onfocusout: false,
            errorLabelContainer: "#errorContainer",
            wrapper: "li"
        });
    });
//    $.validator.setDefaults({
//        submitHandler: function(form) { form.submit(); }
//    });
               
//表单验证
    $().ready(function() {
    $("#NextForm").validate({
            rules: {
                newUserName: { required: true, rangelength: [6, 12] },
                emailAddress: { required: true, email: true },
                newPassWord: { required: true, rangelength: [6, 12] },
                checkbox: { required: true },
                confirmPassWord: { required: true, rangelength: [6, 12], equalTo: "#newPassWord" }
            },
            messages: {                
                newUserName: { required: "Please enter your UserName.", rangelength: "UserName must be in 6-12 between characters." },
                emailAddress: { required: "Please enter your EmailAddress.", email: "Please enter a valid E-mail accounts." },
                newPassWord: { required: "Please enter your Password.", rangelength: "PassWord length must be in 6-12 between characters." },
                checkbox: { required: "Please agree to our terms." },
                confirmPassWord: { required: "Please enter your ConfirmPassWord.", rangelength: "confirmPassWord length must be in 6-12 between characters.", equalTo: "Two password input disagreed." }
                
            },
            remote: {
                url: "Account/Next",     //后台处理程序
                type: "post",               //数据发送方式
                dataType: "json",           //接受数据格式    
                data: {                     //要传递的数据
                    username: function() {
                        return $("#newUserName").val();
                        return $("#newPassWord").val();
                        return $("#emailAddress").val();
                    }
                }
            }
        });
    });
    $.validator.setDefaults({
        submitHandler: function(form) { form.submit(); }
    });
    

    function hideLoginArea() {
        $(".sign_up").find(".textarea").val("");
        $(".sign_up").hide();
        $("label[class='error']").remove();
    };

    function showLoginArea() {
        $(".sign_up").show();
    };

//    function clientLoginVerfiy() {
//        $("#loginForm").validate({
//            rules: {
//                userName: {
//                    required: true
//                },
//                passWord: {
//                    required: true
//                }
//            },

//            messages: {
//                userName: {
//                    required: "User Name is required."
//                },
//                passWord: {
//                    required: "Password is required."
//                }
//            },

//            onfocusout: false,
//            errorLabelContainer: "#errorContainer",
//            wrapper: "li"

//        });
//    }
    </script>
    <style type="text/css">
        .error
        {
            text-align: left;
            color: Red;
        }
    </style>
    <form id="loginForm" action="/Account/Login" method="post">
    <div id="errorContainer" >
        `</div>
    <div class="sign_up_login">
        <p class="review_l_t">
            <a href="#" onclick="showLoginArea();">Already a member?</a></p>
        <div class="sign_up">
            <b class="sign_up_l"></b>
            <div class="sign_up_c">
                <div class="sign_up_form">
                    <ul>
                        <li class="sign_up_form_a">
                            <label>
                                User Name:</label>
                            <span>
                                <input name="userName" id="userName" type="text" class="textarea" value="" /></span>
                        </li>
                        <li class="sign_up_form_a">
                            <label>
                                Password:</label>
                            <span>
                                <input name="passWord" id="passWord" type=password class="textarea" value="" /></span></li>
                        <li class="sign_up_button1">
                            <label>
                                <input type="submit" name="button" id="button" value=""  /></label>
                            <em><a href="/Account/Forgot">forgot password? </a></em></li>
                    </ul>
                </div>
                <div class="sign_up_started">
                    <a href="#">
                        <img src="../../Content/images/sign_up_img4.gif" alt="" onclick="hideLoginArea();" /></a>
                    <p id="pSignUp">
                        Sign up now and get started!</p>
                </div>
            </div>
            <b class="sign_up_r"></b>
        </div>
    </div>
    </form>
<form id="NextForm" action="/Account/Next" method=post> 
    <div class="why">
        <div class="review_l">
            <div class="sign_up_m">
                <h1>
                    Sign up to Cognisess</h1>
                <p>
                    Hi, to become a member and start training, save your scores, and compare results
                    to others you need a Cognisess account.</p>
            </div>
            <div class="review_lf">
                <b class="review_lf_t"><b class="review_lf_tl"></b><b class="review_lf_tr"></b></b>
                <b class="review_lf_c">
                    <div class="sign_up_fa">
                        <h2>
                            Personal Details</h2>
                        <p class="sign_up_fa_wenzi">
                            Your personal contact details.</p>
                    </div>
                    <div class="sign_up_fa">
                        <ul class="sign_up_fa_one"><span　id="Tip"></span>
                            <li>
                                <label>
                                    Contact Name:</label><span><input name="newUserName" id="newUserName" type="text" class="textarea" 
                                        value="" /></span></li>
                            <li>
                                <label>
                                    Email Address:</label><span><input id="emailAddress" name="emailAddress" type="text" class="textarea"
                                        value="" /></span></li>
                            <li>
                                <label>
                                    &nbsp;</label><font color="#7abc35">This will be your username.</font></li>
                            <li>
                                <label>
                                    Password:</label><span><input name="newPassWord" id="newPassWord" type="password" class="textarea" value="" /></span></li>
                            <li>
                                <label>
                                    Confirm Password:</label><span><input name="confirmPassWord" id="confirmPassWord" type="password" class="textarea"
                                        value="" /></span></li>
                        </ul>
                    </div>
                    <div class="sign_up_fb">
                        <input type="checkbox" name="checkbox" id="checkbox" />
                        I agree to the Cognisess <a href="/Account/Terms">Terms and Conditions</a>
                        <p class="sign_up_fb_button">
                            <input type="submit" name="addUser" id="addUser" value="" /></p>
                    </div>
                </b><b class="review_lf_d"><b class="review_lf_dl"></b><b class="review_lf_dr"></b>
                </b>
            </div>
        </div>
        <span class="review_r"><b class="review_lf_t"><b class="review_lf_tl"></b><b class="review_lf_tr">
        </b></b><b class="review_r_c">&nbsp;</b> <b class="review_lf_d"><b class="review_lf_dl">
        </b><b class="review_lf_dr"></b></b></span>
    </div>
</form>
</asp:Content>
